<template>
  <div id="app">
    <router-view />
  </div>
</template>

<style lang="scss">
::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 8px; /*高宽分别对应横竖滚动条的尺寸*/
  height: 4px;
}
::-webkit-scrollbar-track-piece {
  background: rgba(200, 200, 200, 0.1);
}
::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  border-radius: 8px;
  background: rgba(200, 200, 200, 0.5);
}

.el-theme1 .el-message-box__header {
  padding: 15px;
}

.el-theme1 .el-message-box__header,
.el-theme1 .el-message-box__content {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.el-theme1 .el-message-box__title {
  text-align: center;
}

.el-theme1 .el-message-box__status.el-icon-warning {
  display: none;
}

.el-theme1 .el-message-box__status + .el-message-box__message {
  padding: 20px 20px;
  text-align: center;
}

.el-theme1 .el-message-box__headerbtn {
  background: url('~@/assets/widget/del-icon.png');
  width: 18px;
  height: 18px;
}

// .el-theme1 .el-icon-close::before {
//   content: ' ';
//   background: transparent;
// }
.el-theme1 .el-message-box__headerbtn .el-icon-close::before {
  content: ' ';
  background: transparent;
}

.el-theme1 .el-message-box__btns {
  text-align: center;
  padding: 15px 15px 0 15px;
  display: flex;
  flex-direction: row;
  justify-content: center;

  .cancel-msgbtn,
  .confirm-msgbtn {
    display: flex;
    width: 97px;
    height: 34px;
    background: #2b2b2c;
    border: none;
    justify-content: center;
    align-items: center;
    border-radius: 4px;

    span {
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      font-size: 14px;
      color: #fff;
      font-family: 'PingFang SC';
    }

    span::before {
      content: '';
      display: block;
      width: 12px;
      height: 12px;
      background: url('');
      margin-right: 4px;
    }
  }

  .cancel-msgbtn:hover {
    animation: lighterCancelBtn 0.001s 0.2 linear forwards;
  }

  @keyframes lighterCancelBtn {
    from {
      background-color: #2b2b2c;
    }
    to {
      background-color: rgba(255, 255, 255, 0.8);
    }
  }

  .confirm-msgbtn:hover {
    animation: lighterConfirmBtn 0.001s 0.2 linear forwards;
  }

  @keyframes lighterConfirmBtn {
    from {
      background-color: #0d48ce;
    }
    to {
      background-color: rgba(255, 255, 255, 0.8);
    }
  }

  .confirm-msgbtn {
    background: #0d48ce;

    span::before {
      background: url('');
    }
  }
}

.el-theme1 .el-message-box__btns button:nth-child(2) {
  margin-left: 24px;
}

.el-theme1 .el-switch.is-checked .el-switch__core {
  border-color: rgb(13, 72, 206);
  background-color: rgb(13, 72, 206);
}

.el-theme1 .el-textarea__inner {
  padding-bottom: 36px;
}

.el-theme1 .el-link.el-link--primary {
  color: #0d48ce;
}

.sidemenu-main-icon > li > div > svg {
  font-size: 16px;
}

.sidebar-container {
  .el-menu-vertical-demo.el-menu > div:last-of-type {
    margin-bottom: 50px;
  }
}
</style>
